import { createApp } from 'vue';

import { registerAccessDirective } from '@vben/access';
import { initStores } from '@vben/stores';
import '@vben/styles';
import '@vben/styles/ele';

import { setupI18n } from '#/locales';

import App from './app.vue';
import { router } from './router';

import VMdPreview from '@kangc/v-md-editor/lib/preview';
import '@kangc/v-md-editor/lib/style/preview.css';
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';
 
// highlightjs
import hljs from 'highlight.js';
// import hljs from 'highlight.js';
// 高亮语法
// import Prism from "vite-plugin-prismjs";
import Prism from "prismjs";

async function bootstrap(namespace: string) {
  VMdPreview.use(vuepressTheme, {
    Hljs: hljs,
    Prism: Prism,
    config: {
        toc: {
          includeLevel: [3, 4],
        },
      },
  });

  const app = createApp(App);

  // 国际化 i18n 配置
  await setupI18n(app);

  // 配置 pinia-tore
  await initStores(app, { namespace });

  // 安装权限指令
  registerAccessDirective(app);

  // 配置路由及路由守卫
  app.use(router);
  
  app.use(VMdPreview);

  app.mount('#app');
}

export { bootstrap };
